<!DOCTYPE html>
<html>
<head>
<title>普通用户列表</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<link rel="stylesheet" href="../../css/bootstrap.min.css">
<link rel="stylesheet" href="../../css/font-awesome.min.css">
<link rel="stylesheet" href="../../plugins/jqgrid/ui.jqgrid-bootstrap.css">
<link rel="stylesheet" href="../../plugins/ztree/css/metroStyle/metroStyle.css">
<link rel="stylesheet" href="../../css/main.css">
<link rel="stylesheet" href="../../css/select.css">
<script src="../../libs/jquery.min.js"></script>
<script src="../../plugins/layer/layer.js"></script>
<script src="../../libs/bootstrap.min.js"></script>
<script src="../../plugins/lhgcalendar/lhgcalendar.min.js"></script>
<script src="../../libs/vue.min.js"></script>
<script src="../../libs/validator.min.js"></script>
<script src="../../plugins/jqgrid/grid.locale-cn.js"></script>
<script src="../../plugins/jqgrid/jquery.jqGrid.min.js"></script>
<script src="../../plugins/ztree/jquery.ztree.all.min.js"></script>
<script src="../../js/common.js"></script>
<script type="text/javascript">
	$(function(){
	    $('#startDate').calendar({onSetDate:function(){
	    		setDate(this);
	    	}
	    });
	    $('#endDate').calendar({onSetDate:function(){
	    		setDate(this);
	    	}
	    });
	    function setDate(obj){
	    	var year=obj.getDate('y');
			var month=obj.getDate('M');
			if(month && month<10)
				month="0"+month;
			var day=obj.getDate('d');
			if(day && day<10)
				day="0"+day;
			if(!year && !month && !year){
				vm.user[obj.inpE.id]="";
			}else{
				var date=year+"-"+month+"-"+day;
	    		vm.user[obj.inpE.id]=date;
			}
	    }
	});
</script>
</head>
<body>
<div id="rrapp" v-cloak>
	<div v-show="showList">
		<div class="grid-btn">
			注册日期：&nbsp;&nbsp;
			<input id="startDate" type="text" class="date-picker form-control" style="display: inline-block; width: auto;" v-model="user.startDate" data-date-format="yyyy-mm-dd" data-field="datetime" readonly placeholder="选择开始时间">
            &nbsp;&nbsp;-&nbsp;&nbsp;
            <input id="endDate" type="text" class="date-picker form-control" style="display: inline-block; width: auto;" v-model="user.endDate" data-date-format="yyyy-mm-dd" data-field="datetime" readonly placeholder="选择结束时间">
			&nbsp;&nbsp;用户名：&nbsp;&nbsp;
			<!-- <input type="text" v-model="user.username" class="form-control" style="display: inline-block; width: auto;" placeholder="输入用户名">
			&nbsp;&nbsp;手机号：&nbsp;&nbsp; -->
			<input type="text" v-model="user.mobile" class="form-control" style="display: inline-block; width: auto;" placeholder="输入手机号">
			&nbsp;&nbsp;&nbsp;&nbsp;<a class="btn btn-primary" @click="query">查询</a> 
		</div>
		<div class="grid-btn">
			<a class="btn btn-primary" @click="javascript:alert('暂未实现')"><i class="fa fa-file-excel-o"></i>&nbsp;导出</a>
            <a class="btn btn-primary" @click="openOrClose(0)">&nbsp;禁用</a>
            <a class="btn btn-primary" @click="openOrClose(1)">&nbsp;启用</a>
		</div>

	    <table id="jqGrid"></table>
	    <div id="jqGridPager"></div>
    </div>
    
    <div v-show="!showList" class="panel panel-default">
		<div class="panel-heading">{{title}}</div>
		<div class="fd" style="width:100%; margin-left:20px;margin-top:20px;" >
		   	<div class="fd" style="padding:0 20px;min-width:150px;text-align:right;" >用户名：</div>
		   	<div class="fd" >{{user.username}}</div>
		</div>
		<!-- <div class="fd" style="width:100%; margin-left:20px;margin-top:20px;" >
		   	<div class="fd" style="padding:0 20px;min-width:150px;text-align:right;" >登录次数：</div>
		   	<div class="fd" >{{user.loginTimes}}</div>
		</div> -->
		<div class="fd" style="width:100%; margin-left:20px;margin-top:20px;" >
		   	<div class="fd" style="padding:0 20px;min-width:150px;text-align:right;" >注册时间：</div>
		   	<div class="fd" >{{user.createTime}}</div>
		</div>
		<!-- <div class="fd" style="width:100%; margin-left:20px;margin-top:20px;" >
		   	<div class="fd" style="padding:0 20px;min-width:150px;text-align:right;" >最后登录时间：</div>
		   	<div class="fd" >{{user.lastLoginTime}}</div>
		</div> -->
	<!-- 	<div class="fd" style="width:100%; margin-left:20px;margin-top:20px;" >
		   	<div class="fd" style="padding:0 20px;min-width:150px;text-align:right;" >位置信息：</div>
		   	<div class="fd" >{{user.location}}</div>
		</div> -->
		<div class="fd" style="width:100%; margin-left:20px;margin-top:20px;" >
			<div class="fd" style="padding:0 20px;min-width:150px;text-align:right;" >联系方式：</div> 
			<div class="fd" >{{user.mobile}}</div>
		</div>
		<div style="width:100%;text-align:center;margin-top:20px;margin-bottom:20px;" >
            <input type="button" class="btn btn-warning" @click="reload" value="返回"/>
        </div>
	</div>
</div>

<script src="../../js/modules/users/user.js"></script>
</body>
</html>